<!-- <template>
  <div>
    <h2>视频分析</h2>
    <div class="file-upload">
      <input type="file" @change="handleFileChange" accept="video/*" />
      <p v-if="videoFile">已选择文件: {{ videoFile.name }}</p>
      <button @click="analyzeVideo" :disabled="isAnalyzing || !videoFile">
        {{ isAnalyzing ? '分析中...' : '分析视频' }}
      </button>
      <div v-if="errorMessage" style="color:red;">{{ errorMessage }}</div>
    </div>
    <div v-if="analysisResult">
      <h3>分析结果</h3>
      <p v-if="analysisResult.summary">{{ analysisResult.summary }}</p>
      <div v-if="analysisResult.behaviors && analysisResult.behaviors.length">
        <h4>行为分析</h4>
        <ul>
          <li v-for="(behavior, index) in analysisResult.behaviors" :key="index">
            {{ behavior }}
          </li>
        </ul>
      </div>
      <div v-if="analysisResult.images && analysisResult.images.length">
        <h4>分析图片</h4>
        <div v-for="img in analysisResult.images" :key="img">
          <img :src="img" width="200" />
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      isAnalyzing: false,
      analysisResult: null,
      errorMessage: '',
      videoFile: null,
      videoUrl: ''
    }
  },
  methods: {
    handleFileChange(e) {
      const file = e.target.files[0];
      if (!file) return;

      this.isUploading = true;
      this.uploadProgress = 0;

      const formData = new FormData();
      formData.append('file', file);
      axios.post('/api/upload-video', formData, {
        headers: { 'Content-Type': 'multipart/form-data' }
      })
      .then(response => {
        this.isUploading = false;
        this.uploadProgress = 100;
        this.originalVideoUrl = response.data.videoUrl;
        this.filename = response.data.video_name || response.data.filename;
        localStorage.setItem('originalVideoUrl', this.originalVideoUrl);
        localStorage.setItem('currentAnalyzedVideo', this.filename);
      })
      .catch(error => {
        this.isUploading = false;
        this.uploadProgress = 0;
        alert('上传失败: ' + (error.response?.data?.message || error.message));
      });
    },
    async analyzeVideo() {
      if (!this.videoFile) {
        this.errorMessage = '请先选择视频文件';
        return;
      }
      this.isAnalyzing = true;
      this.analysisResult = null;
      this.errorMessage = '';

      const formData = new FormData();
      formData.append('file', this.videoFile);

      try {
        const res = await fetch('/api/upload-video', {
          method: 'POST',
          body: formData
        });
        const data = await res.json();
        if (!res.ok || !data.success) {
          throw new Error(data.message || '分析失败');
        }
        this.videoUrl = data.video_url;
        this.analysisResult = {
          behaviors: data.behaviors || [],
          summary: data.summary || '',
          images: data.images || []
        };
        this.$router.push('/home')
      } catch (err) {
        this.errorMessage = err.message || '分析过程中发生错误';
      } finally {
        this.isAnalyzing = false;
      }

      axios.post('/api/analyze-video', {
        filename: this.filename,
        account: localStorage.getItem('account')
      })
      .then(res => {
        // ...
      })
    }
  }
}
</script> -->